import {InputNumber} from "element-ui";

export default {
    name: 'ElInputNumber',
    extends: InputNumber,
    props: {
      controls: {type: Boolean, default: false}
    },
    data() {
      return {
        currentValue: null
      }
    },
    watch: {
      value: {
        immediate: true,
        handler(value) {
          this.userInput = null;
          let newVal = value === undefined || value === null || value === '' ? value : Number(value);
  
          if (newVal !== undefined && value !== null && value !== '') {
            if (isNaN(newVal)) return null;
            if (this.stepStrictly) {
              const stepPrecision = this.getPrecision(this.step), precisionFactor = Math.pow(10, stepPrecision);
              newVal = Math.round(newVal / this.step) * precisionFactor * this.step / precisionFactor;
            }
            if (this.precision !== undefined) newVal = this.toPrecision(newVal, this.precision);
          }
          if (newVal >= this.max) newVal = this.max;
          if (newVal <= this.min) newVal = this.min;
  
          this.currentValue = newVal;
          this.$emit('input', newVal);
        }
      }
    },
    computed: {
      displayValue() {
        if (this.userInput !== null) return this.userInput;
        let currentValue = this.currentValue;
        if (typeof currentValue === 'number') {
          if (this.stepStrictly) {
            const stepPrecision = this.getPrecision(this.step), precisionFactor = Math.pow(10, stepPrecision);
            currentValue = Math.round(currentValue / this.step) * precisionFactor * this.step / precisionFactor;
          }
          if (this.precision !== undefined) currentValue = this.toPrecision(currentValue, this.precision);
        }
  
        return currentValue;
      }
    },
    methods: {
      // setCurrentValue(newVal) {
      //   const oldVal = this.currentValue;
      //   if (typeof newVal === 'number' && this.precision !== undefined) {
      //     newVal = this.toPrecision(newVal, this.precision);
      //   }
      //   if (newVal >= this.max) newVal = this.max;
      //   if (newVal <= this.min) newVal = this.min;
      //   if (oldVal === newVal) return;
      //   this.userInput = null;
      //
      //   this.$emit('input', newVal);
      //   this.$emit('change', newVal, oldVal);
      //   this.currentValue = newVal;
      // },
      // handleInput(value) {
      //   this.userInput = value;
      // },
      // handleInputChange(value) {
      //   const newVal = value === undefined || value === null || value === '' ? null : Number(value);
      //   if (!isNaN(newVal) || value === '') {
      //     this.setCurrentValue(newVal);
      //   }
      //   this.userInput = null;
      // },
      increase(evt) {
        if (evt && evt.type === 'keydown') return false;
        if (this.inputNumberDisabled || this.maxDisabled) return;
  
        const value = this.value || 0, newVal = this._increase(value, this.step);
        this.setCurrentValue(newVal);
      },
      decrease(evt) {
        if (evt && evt.type === 'keydown') return false;
        if (this.inputNumberDisabled || this.maxDisabled) return;
  
        const value = this.value || 0, newVal = this._decrease(value, this.step);
        this.setCurrentValue(newVal);
      }
    }
}